<template>
  <div class="father">
    <h3>父组件</h3>
    <!-- v-model的本质 -->
    <!-- <input
    :value="username"
    @input="username=(<HTMLInputElement>$event.target).value"/> -->
      <!-- 绑定在自定义组件上的v-model本质上是以下代码--> 
    <!-- <SelfInput :modelValue="username" @update:modelValue="username=$event"/> -->
    <SelfInput v-model:username="username" v-model:userpwd="userpwd"/>
  </div>
</template>

<script setup lang="ts" name="Father">
	import { ref } from "vue";
  import SelfInput from './SelfInput.vue'
  let username=ref("你好")
  let userpwd=ref("再见")
 
</script>

<style scoped>
.father {
  padding: 20px;
  background-color: rgb(165, 164, 164);
  border-radius: 10px;
}
</style>
